<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">

<head>
    <meta charset=utf-8"utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">

    <title>博客模板功能介绍</title>
    <meta name="description" content="在此之前我有写过一篇如何使用我博客模板的文章 请先看这篇基础集成，这篇文章主要讲的是如何使用和修改我的博客主题，文章内容含以下几点：">
    <meta name="author" content="leopardpan">

    <meta name="twitter:card" content="summary">
    <meta name="twitter:title" content="博客模板功能介绍">
    <meta name="twitter:description" content="在此之前我有写过一篇如何使用我博客模板的文章 请先看这篇基础集成，这篇文章主要讲的是如何使用和修改我的博客主题，文章内容含以下几点：">

    <meta property="og:type" content="article">
    <meta property="og:title" content="博客模板功能介绍">
    <meta property="og:description" content="在此之前我有写过一篇如何使用我博客模板的文章 请先看这篇基础集成，这篇文章主要讲的是如何使用和修改我的博客主题，文章内容含以下几点：">

    <link rel="icon" type="image/png" th:href="@{/images/favicon.png}"/>
    <link href="/images/favicon.png" rel="shortcut icon" type="image/png">

    <link rel="stylesheet" th:href="@{/css/main.css}" tppabs="https://leopardpan.cn/css/main.css">
    <link th:href="@{/css/font-awesome.min.css}"
          tppabs="https://netdna.bootstrapcdn.com/font-awesome/4.1.0/css/font-awesome.min.css" rel="stylesheet">

    <link rel="canonical" href="http://0.0.0.0:4000/2020/07/blog_info/">
    <link rel="alternate" type="application/rss+xml" title="柳勇" href="http://0.0.0.0:4000/feed.xml">

    <meta name="google-site-verification" content="1-1ZlHoRvM0T2FqPbW2S-qLgYXN6rsn52kErlMPd_gw"/>

    <!-- 站点统计 -->
    <script
            async th:src="@{/js/busuanzi.pure.mini.js}"
            tppabs="https://busuanzi.ibruce.info/busuanzi/2.3/busuanzi.pure.mini.js">
    </script>

    <!-- 百度统计 -->

    <script>
        var _hmt = _hmt || [];
        (function () {
            var hm = document.createElement("script");
            hm.src = "hm.js-8ba1c6be0953b6f9c2ba38e57f615421"/*tpa=https://hm.baidu.com/hm.js?8ba1c6be0953b6f9c2ba38e57f615421*/;
            var s = document.getElementsByTagName("script")[0];
            s.parentNode.insertBefore(hm, s);
        })();
    </script>


</head>


<body>

<span class="mobile btn-mobile-menu">
      <div class="nav_container">
         <nav class="nav-menu-item" style="float:right">
            <i class="nav-menu-item">
              <a th:href="@{/index}" tppabs="https://leopardpan.cn/#blog" title="" class="blog-button">  博客主页
              </a>
            </i>
            
                <i class="nav-menu-item">

                  <a th:href="@{/allArticle}" tppabs="https://leopardpan.cn/archive" title="archive"
                     class="btn-mobile-menu__icon">
                      所有文章
                  </a>
                </i>
            
                <i class="nav-menu-item">

                  <a th:href="@{/label}" tppabs="https://leopardpan.cn/tags" title="tags" class="btn-mobile-menu__icon">
                      标签
                  </a>
                </i>
            
                <i class="nav-menu-item">

                  <a th:href="@{/ThchSupport}" tppabs="https://leopardpan.cn/support" title="support"
                     class="btn-mobile-menu__icon">
                      技术支持
                  </a>
                </i>
            
                <i class="nav-menu-item">

                  <a th:href="@{/aboutme}" tppabs="https://leopardpan.cn/about" title="about"
                     class="btn-mobile-menu__icon">
                      关于我
                  </a>
                </i>
            
          </nav>
      </div>
    </span>

<header class="panel-cover panel-cover--collapsed" style="background-image: url('/images/background-cover.jpg')">
    <div class="panel-main">

        <div class="panel-main__inner panel-inverted">
            <div class="panel-main__content">
                <!-- 头像效果-start -->
                <div class="ih-item circle effect right_to_left">
                    <a th:href="@{/index}" tppabs="https://leopardpan.cn/#blog" title="前往 柳勇 的主页" class="blog-button">
                        <div class="img"><img src="avatar.jpg" tppabs="https://leopardpan.cn/images/avatar.jpg"
                                              alt="img"></div>
                        <div class="info">
                            <div class="info-back">
                                <h2>

                                    leopardpan

                                </h2>
                                <p>

                                    iOS / 机器学习

                                </p>
                            </div>
                        </div>
                    </a>
                </div>
                <!-- 头像效果-end -->
                <h1 class="panel-cover__title panel-title"><a href="index.htm#blog" tppabs="https://leopardpan.cn/#blog"
                                                              title="link to homepage for 柳勇" class="blog-button">柳勇</a>
                </h1>

                <span class="panel-cover__subtitle panel-subtitle">个人站</span>

                <hr class="panel-cover__divider"/>
                <p class="panel-cover__description">欢迎来到我的个人站~</p>
                <hr class="panel-cover__divider panel-cover__divider--secondary"/>


                <div class="navigation-wrapper">
                    <div>
                        <nav class="cover-navigation cover-navigation--primary">
                            <ul class="navigation">
                                <li class="navigation__item"><a th:href="@{/index}" tppabs="https://leopardpan.cn/#blog"
                                                                title="" class="blog-button">博客主页</a></li>

                                <li class="navigation__item"><a th:href="@{/allArticle}"
                                                                tppabs="https://leopardpan.cn/archive" title="archive">所有文章</a>
                                </li>

                                <li class="navigation__item"><a th:href="@{label}" tppabs="https://leopardpan.cn/tags"
                                                                title="tags">标签</a></li>

                                <li class="navigation__item"><a th:href="@{/ThchSupport}"
                                                                tppabs="https://leopardpan.cn/support" title="support">技术支持</a>
                                </li>

                                <li class="navigation__item"><a th:href="@{/aboutme}"
                                                                tppabs="https://leopardpan.cn/about"
                                                                title="about">关于我</a></li>

                            </ul>
                        </nav>
                    </div>
                </div>


            </div>
        </div>
    </div>


    <div class="panel-cover--overlay cover-clear"></div>

    </div>
</header>


<div class="content-wrapper">
    <div class="content-wrapper__inner">
        <head>
            <link rel="stylesheet" th:href="@{/css/post.css}" tppabs="https://leopardpan.cn/css/post.css">
        </head>

        <article class="post-container post-container--single" itemscope itemtype="http://schema.org/BlogPosting">
            <header class="post-header">
                <h1 class="post-title">博客模板功能介绍</h1>
                <div class="post-meta">
                    <img th:src="@{/images/calendar.png}" tppabs="https://leopardpan.cn/images/calendar.png"
                         width="20px"/>
                    <time datetime="2020-07-11 00:00:00 +0800" itemprop="datePublished" class="post-meta__date date">
                        2020-07-11
                    </time>

                    <span id="busuanzi_container_page_pv"> | 阅读：<span id="busuanzi_value_page_pv"></span>次</span>
                    </p>
                </div>
            </header>


            <h2 class="post-title">目录</h2>
            <ul>
                <li><a href="#博客特性">博客特性</a></li>
                <li><a href="#博客主要模块介绍">博客主要模块介绍</a>
                    <ul>
                        <li><a href="#_configyml">_config.yml</a></li>
                        <li><a href="#_posts">_posts</a></li>
                        <li><a href="#自定义页面">自定义页面</a></li>
                        <li><a href="#修改说明">修改说明</a></li>
                    </ul>
                </li>
            </ul>


            <section class="post">
                <p>在此之前我有写过一篇<a href="index-4.html" tppabs="http://leopardpan.cn/2016/10/jekyll_tutorials1/">如何使用我博客模板的文章</a>
                    请先看这篇基础集成，这篇文章主要讲的是如何使用和修改我的博客主题，文章内容含以下几点：</p>

                <p th:utext="${detail}"></p>

                <!--<h2 id="博客特性">博客特性</h2>


                <ul class="task-list">
                    <li class="task-list-item"><input type="checkbox" class="task-list-item-checkbox"
                                                      disabled="disabled" checked="checked"/>适配电脑、手机、平板等各屏幕
                    </li>
                    <li class="task-list-item"><input type="checkbox" class="task-list-item-checkbox"
                                                      disabled="disabled" checked="checked"/>响应式设计
                    </li>
                    <li class="task-list-item"><input type="checkbox" class="task-list-item-checkbox"
                                                      disabled="disabled" checked="checked"/>个性化头像
                    </li>
                    <li class="task-list-item"><input type="checkbox" class="task-list-item-checkbox"
                                                      disabled="disabled" checked="checked"/>每篇文章自动添加打赏功能
                    </li>
                    <li class="task-list-item"><input type="checkbox" class="task-list-item-checkbox"
                                                      disabled="disabled" checked="checked"/>支持Disqus、livere评论系统
                    </li>
                    <li class="task-list-item"><input type="checkbox" class="task-list-item-checkbox"
                                                      disabled="disabled" checked="checked"/>支持站点总数访问统计，每篇文章访问统计
                    </li>
                    <li class="task-list-item"><input type="checkbox" class="task-list-item-checkbox"
                                                      disabled="disabled" checked="checked"/>支持文章自动生成目录
                    </li>
                    <li class="task-list-item"><input type="checkbox" class="task-list-item-checkbox"
                                                      disabled="disabled" checked="checked"/>支持标签分类
                    </li>
                    <li class="task-list-item"><input type="checkbox" class="task-list-item-checkbox"
                                                      disabled="disabled" checked="checked"/>支持代码高亮
                    </li>
                    <li class="task-list-item"><input type="checkbox" class="task-list-item-checkbox"
                                                      disabled="disabled" checked="checked"/>支持文章H1、H2、H3、H4标题样式多样化
                    </li>
                    <li class="task-list-item"><input type="checkbox" class="task-list-item-checkbox"
                                                      disabled="disabled" checked="checked"/>支持多种三方社交icon展示，能从博客直接跳转到自己的三方社交主页
                    </li>
                    <li class="task-list-item"><input type="checkbox" class="task-list-item-checkbox"
                                                      disabled="disabled" checked="checked"/>支持三方社交分享(facebook、twitter)
                    </li>
                </ul>

                <h2 id="博客主要模块介绍">博客主要模块介绍</h2>

                <h3 id="_configyml">_config.yml</h3>

                <p><code class="highlighter-rouge">_config.yml</code> 是博客的配置文件，整个站点的信息都在这修改，想要把我的模板改成你自己的也需要修改<code
                        class="highlighter-rouge">_config.yml</code></p>

                <p><strong>重要字段说明</strong></p>

                <ul>
                    <li>enableToc: 是否开启文章自动生成目录，设置为false文章不会自动生成目录</li>
                    <li>comment/livere: livere评论系统，支持微信、qq、微博、豆瓣、twitter等登录后可以直接评论</li>
                    <li>comment/disqus: disqus评论系统，支持facebook、twitter等登录后可以直接评论</li>
                    <li>social/weibo、github、zhihu、jianshu等: 个人站底部展示的微博等三方社交按钮，点击后直接跳转到个人微博或其他社交主页</li>
                    <li>baidu/id: 百度统计，用来统计你个人站点的用户访问情况</li>
                    <li>ga/id: google统计，用来统计你个人站点的用户访问情况</li>
                </ul>

                <p>_config.yml 文件除以上字段还有一些可以自行修改，例如title之类的字段</p>

                <h3 id="_posts">_posts</h3>

                <p><code class="highlighter-rouge">_posts</code> 目录是用来存放文章的目录，写新文章，直接放在这个目录即可</p>

                <p>使用博客模板时，请把博客自带的文章给去掉，如果想使用博客自带的文章请 <code class="highlighter-rouge">注明出处</code>。</p>

                <h3 id="自定义页面">自定义页面</h3>

                <p>about.md、support.md 等为自定义页面，如果你想添加自动以页面可以直接复制about.md 文件修改文件名和里面的内容即可。</p>

                <p>如果需要在导航显示你新增的页面，直接在<code class="highlighter-rouge">_config.yml</code> 文件的nav字段中添加你新页面配置即可</p>

                <h3 id="修改说明">修改说明</h3>

                <p>如果要修改博客模板信息建议只修改<code class="highlighter-rouge">_config.yml</code> 文件内容和 <code
                        class="highlighter-rouge">_posts</code> 里面的文章信息。因为博客模板一直在更新迭代，改动多了以免你后期更新博客模板的时候不方便。</p>

                <p>如果你想改动模板的样式又想继续更新迭代博客模板，你可以提交在github上提交<code class="highlighter-rouge">pull request</code>
                    或者直接给我发邮件建议改成什么样，如果你的提议确实可以，我会采纳的，并且非常感谢你的建议。</p>

                <p>博客迭代信息请看<a href="index-2.html" tppabs="https://leopardpan.cn/2020/07/ReleaseNode/">ReleaseNode</a>
                </p>

                <p>遇到解决不了的问题可以找 <a href="support.html" tppabs="https://leopardpan.cn/support/">技术支持</a></p>


            </section>

        </article>

        <section>

            <div class="content-play">
                <p><a href="javascript:void(0)" onclick="dashangToggle()" class="dashang" title="打赏，支持一下">打赏一个呗</a></p>
                <div class="hide_box-play"></div>
                <div class="shang_box-play">
                    <a class="shang_close-play" href="javascript:void(0)" onclick="dashangToggle()" title="关闭"><img
                            src="close.jpg" tppabs="https://leopardpan.cn/images/payimg/close.jpg" alt="取消"/></a>
                    <div class="shang_tit-play">
                        <p>感谢您的支持，我会继续努力的!</p>
                    </div>
                    <div class="shang_payimg">
                        <img src="alipayimg.jpg" tppabs="https://leopardpan.cn/images/payimg/alipayimg.jpg" alt="扫码支持"
                             title="扫一扫"/>
                    </div>
                    <div class="shang_payimg">
                        <img src="weipayimg.jpg" tppabs="https://leopardpan.cn/images/payimg/weipayimg.jpg" alt="扫码支持"
                             title="扫一扫"/>
                    </div>
                    <div class="pay_explain">扫码打赏，你说多少就多少</div>
                    <div class="shang_payselect">
                        <div class="pay_item checked" data-id="alipay">
                            <span class="pay_logo"><img src="alipay.jpg"
                                                        tppabs="https://leopardpan.cn/images/payimg/alipay.jpg"
                                                        alt="支付宝"/></span>
                        </div>
                        <div class="pay_item" data-id="weipay">
                            <span class="pay_logo"><img src="wechat.jpg"
                                                        tppabs="https://leopardpan.cn/images/payimg/wechat.jpg"
                                                        alt="微信"/></span>
                        </div>
                    </div>
                    <div class="shang_info-play">
                        <p>打开<span id="shang_pay_txt">支付宝</span>扫一扫，即可进行扫码打赏哦</p>
                    </div>
                </div>
            </div>-->
            <script type="text/javascript">
                function dashangToggle() {
                    $(".hide_box-play").fadeToggle();
                    $(".shang_box-play").fadeToggle();
                }
            </script>

            <div style="text-align:center;margin:50px 0; font:normal 14px/24px 'MicroSoft YaHei';"></div>

            <style type="text/css">
                .content-play {
                    width: 80%;
                    margin-top: 20px;
                    margin-bottom: 10px;
                    height: 40px;
                }

                .hide_box-play {
                    z-index: 999;
                    filter: alpha(opacity=50);
                    background: #666;
                    opacity: 0.5;
                    -moz-opacity: 0.5;
                    left: 0;
                    top: 0;
                    height: 99%;
                    width: 100%;
                    position: fixed;
                    display: none;
                }

                .shang_box-play {
                    width: 540px;
                    height: 540px;
                    padding: 10px;
                    background-color: #fff;
                    border-radius: 10px;
                    position: fixed;
                    z-index: 1000;
                    left: 50%;
                    top: 50%;
                    margin-left: -280px;
                    margin-top: -280px;
                    border: 1px dotted #dedede;
                    display: none;
                }

                .shang_box-play img {
                    border: none;
                    border-width: 0;
                }

                .dashang {
                    display: block;
                    width: 100px;
                    margin: 5px auto;
                    height: 25px;
                    line-height: 25px;
                    padding: 10px;
                    background-color: #E74851;
                    color: #fff;
                    text-align: center;
                    text-decoration: none;
                    border-radius: 10px;
                    font-weight: bold;
                    font-size: 16px;
                    transition: all 0.3s;
                }

                .dashang:hover {
                    opacity: 0.8;
                    padding: 15px;
                    font-size: 18px;
                }

                .shang_close-play {
                    float: right;
                    display: inline-block;
                    margin-right: 10px;
                    margin-top: 20px;
                }

                .shang_logo {
                    display: block;
                    text-align: center;
                    margin: 20px auto;
                }

                .shang_tit-play {
                    width: 100%;
                    height: 75px;
                    text-align: center;
                    line-height: 66px;
                    color: #a3a3a3;
                    font-size: 16px;
                    background: url("cy-reward-title-bg.jpg") /*tpa=https://leopardpan.cn/images/payimg/cy-reward-title-bg.jpg*/;
                    font-family: 'Microsoft YaHei';
                    margin-top: 7px;
                    margin-right: 2px;
                }

                .shang_tit-play p {
                    color: #a3a3a3;
                    text-align: center;
                    font-size: 16px;
                }

                .shang_payimg {
                    width: 140px;
                    padding: 10px;
                    padding-left: 80px; /*border:6px solid #EA5F00;**/
                    margin: 0 auto;
                    border-radius: 3px;
                    height: 140px;
                    display: inline-block;
                }

                .shang_payimg img {
                    display: inline-block;
                    margin-right: 10px;
                    float: left;
                    text-align: center;
                    width: 140px;
                    height: 140px;
                }

                .pay_explain {
                    text-align: center;
                    margin: 10px auto;
                    font-size: 12px;
                    color: #545454;
                }

                .shang_payselect {
                    text-align: center;
                    margin: 0 auto;
                    margin-top: 40px;
                    cursor: pointer;
                    height: 60px;
                    width: 500px;
                    margin-left: 110px;
                }

                .shang_payselect .pay_item {
                    display: inline-block;
                    margin-right: 140px;
                    float: left;
                }

                .shang_info-play {
                    clear: both;
                }

                .shang_info-play p, .shang_info-play a {
                    color: #C3C3C3;
                    text-align: center;
                    font-size: 12px;
                    text-decoration: none;
                    line-height: 2em;
                }
            </style>

            <ul class="pager">

                <li class="previous">
                    <a href="index-2.html" tppabs="https://leopardpan.cn/2020/07/ReleaseNode/" data-toggle="tooltip"
                       data-placement="top" title="博客迭代记录">上一篇： <span>博客迭代记录</span>
                    </a>
                </li>


            </ul>
        </section>

        <section class="post-comments">


            <div id="disqus_thread"></div>
            <script>

                var disqus_config = function () {
                    this.page.url = "http://0.0.0.0:4000/2020/07/blog_info/";
                    this.page.identifier = "/2020/07/blog_info/";
                };
                var disqus_shortname = 'leopard';

                (function () { // DON'T EDIT BELOW THIS LINE
                    var d = document, s = d.createElement('script');
                    s.src = '//' + disqus_shortname + '.disqus.com/embed.js';
                    s.setAttribute('data-timestamp', +new Date());
                    (d.head || d.body).appendChild(s);
                })();
            </script>
            <noscript>要查看<a
                    href="javascript:if(confirm('http://disqus.com/?ref_noscript  \n\n���ļ��޷��� Teleport Ultra ����, ��Ϊ ����һ�����·���ⲿ������Ϊ������ʼ��ַ�ĵ�ַ��  \n\n�����ڷ������ϴ���?'))window.location='http://disqus.com/?ref_noscript'"
                    tppabs="http://disqus.com/?ref_noscript"> Disqus </a>评论，请启用 JavaScript
            </noscript>


        </section>


        <section class="footer">
            <footer>
                <div class="footer_div">
                    <nav class="cover-navigation navigation--social">
                        <ul class="navigation">


                            <!-- Github -->
                            <li class="navigation__item_social">
                                <a href="javascript:if(confirm('https://github.com/leopardpan  \n\n���ļ��޷��� Teleport Ultra ����, ��Ϊ ����һ�����·���ⲿ������Ϊ������ʼ��ַ�ĵ�ַ��  \n\n�����ڷ������ϴ���?'))window.location='https://github.com/leopardpan'"
                                   tppabs="https://github.com/leopardpan" title="@leopardpan 的 Github" target="_blank">
                                    <div class="footer-social-icon" style="background:url(/images/github.png);"></div>
                                </a>
                            </li>


                            <!-- Zhihu -->
                            <li class="navigation__item_social">
                                <a href="javascript:if(confirm('https://www.jianshu.com/u/2ada30d8d0f7  \n\n���ļ��޷��� Teleport Ultra ����, ��Ϊ ����һ�����·���ⲿ������Ϊ������ʼ��ַ�ĵ�ַ��  \n\n�����ڷ������ϴ���?'))window.location='https://www.jianshu.com/u/2ada30d8d0f7'"
                                   tppabs="https://www.jianshu.com/u/2ada30d8d0f7" title="@2ada30d8d0f7"
                                   target="_blank">
                                    <div class="footer-social-icon" style="background:url(/images/jianshu.png);"></div>
                                </a>
                            </li>


                            <!-- Weibo -->
                            <li class="navigation__item_social">
                                <a href="javascript:if(confirm('http://weibo.com/5366874726  \n\n���ļ��޷��� Teleport Ultra ����, ��Ϊ ����һ�����·���ⲿ������Ϊ������ʼ��ַ�ĵ�ַ��  \n\n�����ڷ������ϴ���?'))window.location='http://weibo.com/5366874726'"
                                   tppabs="http://weibo.com/5366874726" title="@5366874726 的微博" target="_blank">
                                    <div class="footer-social-icon" style="background:url(/images/weibo.png);"></div>
                                </a>
                            </li>


                            <!-- Email -->
                            <li class="navigation__item_social">
                                <a href="mailto:leopardpan@icloud.com" title="Contact me">
                                    <div class="footer-social-icon" style="background:url(/images/email.png);"></div>
                                </a>
                            </li>


                            <!-- RSS -->
                            <li class="navigation__item_social">
                                <a href="feed.xml" tppabs="https://leopardpan.cn/feed.xml" rel="author" title="RSS"
                                   target="_blank">
                                    <div class="footer-social-icon" style="background:url(/images/rss.png);"></div>
                                    <span class="label">RSS</span>
                                </a>
                            </li>

                        </ul>
                    </nav>

                </div>

                <div class="footer_div">
                    <p class="copyright text-muted">
                        Copyright &copy; 柳勇 2020 Theme by <a href="index.htm"
                                                             tppabs="https://leopardpan.cn/">leopardpan</a> |
                        <iframe
                                style="margin-left: 2px; margin-bottom:-5px;"
                                frameborder="0" scrolling="0" width="91px" height="20px"
                                src="github-btn.html-user=leopardpan&repo=leopardpan.github.io&type=star&count=true"
                                tppabs="https://ghbtns.com/github-btn.html?user=leopardpan&repo=leopardpan.github.io&type=star&count=true">
                        </iframe>
                    </p>
                    <div align="right">
                        <link rel="stylesheet" href="font-awesome.min-1.css"
                              tppabs="https://cdn.bootcss.com/font-awesome/4.3.0/css/font-awesome.min.css">

                        <!-- 访问统计 -->
                        <span id="busuanzi_container_site_pv">
            本站总访问量
            <span id="busuanzi_value_site_pv"></span>次
          </span>

                    </div>
                    <div>
            </footer>
        </section>

    </div>
</div>

<script type="text/javascript" src="jquery-1.11.3.min.js"
        tppabs="https://code.jquery.com/jquery-1.11.3.min.js"></script>
<script type="text/javascript" src="main.js" tppabs="https://leopardpan.cn/js/main.js"></script>

<script type="text/javascript" src="highlight.pack.js" tppabs="https://leopardpan.cn/js/highlight.pack.js"></script>
<!--<script>hljs.initHighlightingOnLoad();</script>-->


</body>

</html>
